<template>
  <div class="aside">
    <aside id="aside" class="border js-fullheight">
      <!-- 个人logo -->
      <h1 class="logo">
        <router-link to="/">周娇简历</router-link>
      </h1>
      <!-- 左侧导航 -->
      <nav class="nav-menu">
        <ul>
          <li>
            <router-link to="/">个人信息</router-link>
          </li>
          <li><router-link to="/work">工作经历</router-link></li>
          <li><router-link to="/project">项目经历</router-link></li>
          <li><router-link to="/skill">专业技能</router-link></li>
          <li><router-link to="/education">教育经历</router-link></li>
          <li><router-link to="/self">自我评价</router-link></li>
        </ul>
      </nav>
    </aside>
  </div>
</template>

<script>
export default {};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
#aside .nav-menu ul li {
  .router-link-exact-active {
    color: #228896;
    font-weight: 600;
  }
  .router-link-exact-active:after {
    visibility: visible;
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
  }
}
</style>
